<%--
  Created by IntelliJ IDEA.
  User: Acer
  Date: 2020/8/31
  Time: 16:58
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="rapid" uri="http://www.rapid-framework.org.cn/rapid" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<rapid:override name="head">
    <title>添加课程</title>
</rapid:override>

<rapid:override name="content">
    <%
        String path = request.getContextPath();
        String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + "/";

    %>

    <form class="layui-form" action="" style="width: 450px;margin: 10px auto">
        <div class="layui-form-item">
            <label class="layui-form-label">课程名称</label>
            <div class="layui-input-block">
                <input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入课程名称" class="layui-input" id="name">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">人数限制</label>
            <div class="layui-input-block">
                <input type="text" name="username" lay-verify="required"  placeholder="请输入人数" autocomplete="off" class="layui-input" id="num">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">学院限制</label>
            <div class="layui-input-block">
                <c:forEach items="${insList}" var="ins">
                    <input type="checkbox" name="ins" title="${ins.insName}" value="${ins.insId}">
                </c:forEach>
            </div>
        </div>

        <button class="layui-btn layui-btn-warm" type="button" id="success" style="margin-left: 200px">确认提交</button>
    </form>

    <script src="<%=basePath%>/statics/js/jquery-3.3.1.js"></script>

    <script>
        $('#success').click(function () {
            // 获取课程名
            let name = $('#name').val();
            // 获取设置的数量
            let num = $('#num').val();
            // 用于获取选到的学院信息
            let ins = "";
            let count = 0;

            $("input[name='ins']:checked").each(function () {
                count ++;
                if(count === 1) {
                    ins = ins + $(this).attr('value');
                } else {
                    // 多个学院名称进行拼接
                    ins = ins + "," + $(this).attr('value');
                }
            })

            let content = name + "|" +num +"|" + ins;

            // 创建一个表单元素(向后台传递数据)
            let myform = document.createElement("form");
            myform.id = "form1";
            myform.name = "form1";
            // 将新建的 form 表单元素添加到 body 中
            document.body.appendChild(myform);

            let input = document.createElement("input");
            input.type = "text";
            input.name = "content";
            input.value = encodeURIComponent(encodeURIComponent((content)));

            myform.appendChild(input);

            myform.method="POST";
            myform.action="<%=basePath%>teacher/insertCourseSuccess?page="+1;

            myform.submit();

            // 传完数据后 删除节点
            document.body.removeChild("form1");

        })
    </script>

</rapid:override>

<%@include file="base.jsp"%>